import React, { Component } from 'react';
import {
    View,
    Text,
    Image,
    TouchableWithoutFeedback
} from 'react-native';
import AniImage from "../AniImage/index";

export default class  extends Component {

    constructor(props) {
        super(props);
        this.state = {
            
        };
    }
    
    
    render() {
        const {data, navigation, styles, index} = this.props;
        return (
            <TouchableWithoutFeedback
                onPress={()=>{ navigation.navigate("Detail", { courseId: data.id })}}
            >
                <View style={[styles.courseItem, index === 0 && styles.courseItemFirst]}>
                    <View style={styles.imgView}>
                        <AniImage
                            styles={styles.imgView}
                            uri={data.img}
                        />
                        {/* <Image
                            style={styles.imgView}
                            source={{uri: data.img}}
                        /> */}
                    </View>
                    <View style={styles.infoView}>
                        <Text
                            numberOfLines={2}
                            style={styles.courseName}
                        >
                            {data.course_name}
                        </Text>
                        <Text
                            style={styles.price}
                        >
                            {~~data.price === 0 ? "免费" : `￥${data.price}`}
                        </Text>
                    </View>
                </View>
            </TouchableWithoutFeedback>
        );
    }
    
}